<template>
  <div>
    <Header></Header>
    <section>
      <Routers></Routers>
      <div id="section" class="main">
        <div class="common_header">
          <span class="common_header_tip">研发活动管理</span>
          <button class="common_header_btn" @click="linkTOadd">添加</button>
        </div>
        <div class="detail_box">
          <ul class="detail_list">
            <li><span class="detail_title">项目名称：</span><span class="detail_content">{{project_name}}</span></li>
            <li><span class="detail_title">项目编号：</span><span class="detail_content">{{com_sn}}{{project_num_year}}{{project_num}}</span></li>
            <li><span class="detail_title">起止时间：</span><span class="detail_content">{{project_time_start}}-{{project_time_end}}</span></li>
            <li><span class="detail_title">技术领域：</span><span class="detail_content">{{lingyu}}</span></li>
            <li><span class="detail_title">技术来源：</span><span class="detail_content">{{project_jishulaiyuan}}</span></li>
            <li><span class="detail_title">知识产权编号：</span><span class="detail_content">{{project_zhishinum}}</span></li>
            <li><span class="detail_title">研发费用总预算(元)：</span><span class="detail_content">{{project_money}}</span></li>
            <li><span class="detail_title">本年度研发经费(元)：</span><span class="detail_content">{{project_money_year}}</span></li>
            <li><span class="detail_title">前一年研发费用(元)：</span><span class="detail_content">{{project_money_previousYear}}</span></li>
            <li><span class="detail_title">前两年研发费用(元)：</span><span class="detail_content">{{project_money_previous2Year}}</span></li>
            <li><span class="detail_title">立项文件：</span><span class="detail_content">{{project_money_previous2Year}}</span></li>
            <li><span class="detail_title">立项报告：</span><span class="detail_content">{{project_money_previous2Year}}</span></li>
            <li><span class="detail_title">验收报告：</span><span class="detail_content">{{project_money_previous2Year}}</span></li>
          </ul>
          <div class="detail_chang_content">
            <div>
              <p class="detail_title">目的及组织实施方式：</p>
              <p class="detail_content">{{project_mudi}}</p>
            </div>
            <div>
              <p class="detail_title">核心技术及创新点：</p>
              <p class="detail_content">{{project_jishuchuangxin}}</p>
            </div>
            <div>
              <p class="detail_title">取得的阶段性成果：</p>
              <p class="detail_content">{{project_chengguo}}</p>
            </div>
          </div>
          <div class="detail_operation_box">
            <button class="editBTN" @click="linkTOedit(1)">编辑</button>
            <button class="delBTN">删除</button>
          </div>
        </div>
      </div>
    </section>
  </div>
</template>

<script>
  import Routers from '@/template/routers.vue'
  import Header from '@/template/common_header.vue'
  export default {
    name: 'rdManagement_detail',
    components: {
      Routers,
      Header
    },
    data () {
      return {
        project_name : '',
        com_sn:this.$store.state.com_sn,
        project_num_year : '',
        project_num : '',
        project_time_start : '',
        project_time_end : '',
        project_money : '',
        project_jishulaiyuan : '',
        project_zhishinum : '',
        project_money_year : '',
        project_money_previousYear : '',
        project_money_previous2Year : '',

        file_lixiang : '',
        file_lixiang_name : '',
        file_baogao : '',
        file_baogao_name : '',
        file_yanshou : '',
        file_yanshou_name : '',

        project_mudi : '',
        project_jishuchuangxin : '',
        project_chengguo : '',

        lingyu : '',
        lingyuID : ''
      }
    },
    mounted: function() {
//      console.log(this.$route.params.id)
      let id = this.$route.params.id
      this.axios.get('/index/show_pro?id='+id).then((res)=>{
        if(res.data.code==1){
          let datas = res.data.data
          this.project_name = datas.pro_name
          this.project_num_year = datas.pro_sn_year
          this.project_num = datas.pro_sn
          this.project_time_start = datas.pro_start
          this.project_time_end = datas.pro_end
          this.project_money = datas.pro_total
          this.project_jishulaiyuan = datas.tec_source
          this.project_zhishinum = datas.know_sn
          this.project_money_year = datas.this_year
          this.project_money_previousYear = datas.pre_year
          this.project_money_previous2Year = datas.pre2_year

          this.file_lixiang = datas.pro_file
          this.file_lixiang_name = datas.pro_file_info
          this.file_baogao = datas.pro_report
          this.file_baogao_name = datas.pro_report_info
          this.file_yanshou = datas.check_report
          this.file_yanshou_name = datas.check_report_info

          this.project_mudi = datas.pro_imp
          this.project_jishuchuangxin = datas.pro_core
          this.project_chengguo = datas.pro_result

          this.lingyu = datas.tec_id.name
          this.lingyuID = datas.tec_id.id
        }
      })
    },
    methods: {
      linkTOadd () {
        this.$router.push('/rdManagement_add')
      },
      linkTOedit (id) {
        this.$router.push({
          path:'/rdManagement_add',
          name:'rdManagement_add',
          params:{
            id:id
          }
        })
      }
    }
  }
</script>

<style scoped>
  @import '../../assets/public.css';
  @import '//at.alicdn.com/t/font_749860_je5eki3tevb.css';

  .detail_box{
    border:1px solid #ddd;
    padding:40px;
    margin-top:30px;
    position: relative;
  }
  .detail_chang_content>div{
    margin-bottom:20px;
  }
  .detail_list{
    display: flex;
    align-items: center;
    flex-wrap: wrap;
  }
  .detail_list>li{
    width:420px;
    margin-bottom:16px;
  }
  .detail_title{
    color: #333;
    font-size:12px;
  }
  .detail_content{
    color: #888;
    font-size:12px;
  }
  .detail_operation_box{
    position: absolute;
    bottom:10px;
    right:10px;
    display: flex;
    align-items: center;
  }
  .detail_operation_box>button{
    width:80px;
    height:30px;
    outline: none;
    border-radius: 5px;
    font-size:14px;
    line-height: 30px;
    background-color: #fff;
    box-sizing: border-box;
    margin-left:20px;
  }
  .detail_operation_box>button.editBTN{
    border: 1px solid #4797D4;
    color: #4797D4;
  }
  .detail_operation_box>button.delBTN{
    border: 1px solid #e44d51;
    color: #e44d51;
  }

</style>
